import './Box.js'

export const MessageBox = {
  confirm(text, config) {
    return new Promise((resolve, reject) => {
      const app = new Vue({
        data: {
          text,
          showBox: true,
          config
        },
        template: `
          <box
            v-if="showBox"
            @cancel="handelCancel"
            @ok="handleOk"
            :confirm-button-text="config.confirmButtonText"
            :cancel-button-text="config.cancelButtonText"
          >
            {{text}}
          </box>
        `,
        methods: {
          handelCancel() {
            this.showBox = false
            reject()
          },
          handleOk() {
            this.showBox = false
            resolve()
          }
        },
      })
      const container = document.createElement('div')
      document.body.appendChild(container)
      app.$mount(container)
    })
  }
}